<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0, initial-scale=1.0, user-scalable=no">
		<meta name="format-detection" content="telephone=no, email=no">
		<meta name="HandheldFriendly" content="true">
		<title>弹框alert</title>
		<link rel="stylesheet" type="text/css" href="http://at.alicdn.com/t/font_808616_yrbvv5ptdqj.css" />
		<link rel="stylesheet" type="text/css" href="../../css/comment.css" />
		<link rel="stylesheet" type="text/css" href="style.css"/>
	</head>

	<body>
		<div class="st-list">
			<div class="st-btn-warp" id="btn1">
				<button class="st-btn st-btn-sky">底部弹出</button>
			</div>
			<div class="st-btn-warp" id="demo">
				<button class="st-btn st-btn-sky ">toast</button>
			</div> 
			
			
			<div class="st-btn-warp" id="demos">
				<button class="st-btn st-btn-sky ">加载中</button>
			</div>
			
			<div class="st-btn-warp" id="demo1">
				<button class="st-btn st-btn-sky ">alert</button>
			</div>
			<div class="st-btn-warp" id="demo2">
				<button class="st-btn st-btn-sky ">confirm</button>
			</div>
			<div class="st-btn-warp" id="demo3">
				<button class="st-btn st-btn-sky ">prompt</button>
			</div>
			<div class="st-btn-warp" id="demo4">
				<button class="st-btn st-btn-sky ">点击按钮跳转</button>
			</div>
			
			<div class="st-btn-warp" id="demo5">
				<button class="st-btn st-btn-sky ">取消默认点击背景消失</button>
			</div>
			
			
			
			<div class="demo">
				<div class="mask-btm">
					<div class="st-bg"></div>
					<div class="st-down">
						<ul>
							<li class="st-border-b" id="share">分享</li>
							<li>删除</li>
						</ul>
						<button id="cancel">取消</button>
					</div>
				</div>
			</div>
		</div>
		<script src="../../js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
		<!--<script src="../../js/index.js" type="text/javascript" charset="utf-8"></script>-->
		<script src="alert.js" type="text/javascript" charset="utf-8"></script>
		<!--<script src="new_file.js" type="text/javascript" charset="utf-8"></script>-->
		<script type="text/javascript">
			$('#demo').click(function() {
				jqtoast('你点击了toast')
			})
			$('#demos').click(function() {
				loadding()
			})
			$('#demo1').click(function () {
				jqalert({
					title:'提示',
					content:'自定义弹窗内容，居左对齐显示，告知需要确认的信息等'
				})
			})
			$('#demo2').click(function () {
				jqalert({
					title:'提示',
					content:'自定义弹窗内容，居左对齐显示，告知需要确认的信息等',
					yestext:'知道了',
					notext:'取消'
				})
			})
			$('#demo3').click(function () {
				jqalert({
					title:'提示',
					prompt:'请问你叫什么名字?',
					yestext:'提交',
					notext:'取消',
					yesfn:function () {
						jqtoast('提交成功');
					},
					nofn:function () {
						jqtoast('你点击了取消');
					}
				})
			})
			$('#share').click(function(){
				jqtoast("分享成功")
			})
			$('#demo4').click(function () {
				jqalert({
					title:'提示',
					content:'自定义弹窗内容，居左对齐显示，告知需要确认的信息等',
					yeslink:'https://www.baidu.com/'
				})
			})
			$('#demo5').click(function () {
				jqalert({
					title:'提示',
					content:'自定义弹窗内容，居左对齐显示，告知需要确认的信息等',
					click_bg:false
				})
			})
		</script>
	</body>

</html>